<template>
	<view class="order-content">
		<view class="item">
			<view class="item-title">会员订单信息</view>
			<view class="item-content">
				<view class="left">订单编号:</view>
				<view class="right one">{{data.code}}</view>
			</view>
			<view class="item-content">
				<view class="left">订单金额:</view>
				<view class="right red">¥{{data.orderAmount}}</view>
			</view>
			<view class="item-content" style="margin-bottom: 20rpx; border-bottom: 1rpx dotted #ebeced">
				<view class="left">优惠券</view>
				<view class="right" v-if="data.couponAmount!=null">- ¥{{data.couponAmount}}</view>
				<view class="right" v-else>无</view>
			</view>
			<view class="item-content">
				<view class="left">实际支付:</view>
				<view class="right fw">¥{{data.payAmount}}</view>
			</view>
		</view>
		<view class="btn" @click="PaymentOrder">确认支付</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: {}
			};
		},
		// 我的页面  
		onLoad() {
			// 监听事件  
			const data = uni.getStorageSync("createorder")
			console.log(data);
			this.data = JSON.parse(data)
		},

		// onLoad(options) {
		// 	// this.detailList=JSON.parse(decodeURIComponent(options.data))
		// 	// const data = options.data;
		// 	// 进行后续操作
		// 	console.log("data: " + decodeURIComponent(options.data).prepay_id);
		// },
		methods: {
			PaymentOrder() {

				uni.requestPayment({
					provider: 'wxpay', //支付类型-固定值
					timeStamp: this.data.timeStamp.toString(), // 时间戳（单位：秒）
					nonceStr: this.data.nonceStr, // 随机字符串
					package: this.data.prepayId, // 固定值
					signType: "RSA", //固定值
					paySign: this.data.paySign, //签名
					success: function(res) {
						// success:{"errMsg":"requestPayment:ok"}

						console.log('success:' + JSON.stringify(res));
						console.log("支付成功");
						uni.showToast({
							title: '支付成功',
							icon: 'success',
							duration: 2000,
							complete() {
								uni.switchTab({
									url: "/pages/home/home"
								});
								uni.$emit("refreshMemberInfo", null);
							}
						})
					},
					fail: function(err) {
						console.log('fail:' + JSON.stringify(err));
						// 支付失败，展示支付失败提示
						wx.showToast({
							title: '支付失败',
							icon: 'none'
						})
					}
				});
			}
		}
	};
</script>

<style lang="scss">
	page {
		background-color: #f5f6fa;
	}

	.order-content {
		top: 0;
		min-height: 100vh;
		background-color: #f5f6fa;

		.item {
			margin: 20rpx auto;
			width: 93%;
			height: 428rpx;
			background: #ffffff;
			border-radius: 20rpx;
			padding: 20rpx;

			.item-title {
				color: #3a3d4b;
				line-height: 62rpx;
				font-weight: 600;
				font-size: 38rpx;
				margin-bottom: 20rpx;
			}

			.item-content {
				display: flex;
				align-items: center;
				padding: 20rpx 0;

				.left {
					color: #77798d;
				}

				.right {
					flex: 1;
					text-align: right;
				}

				.one {
					color: #3a3d4b;
				}

				.red {
					color: #f8323c;
				}

				.fw {
					font-weight: 600;
				}
			}
		}

		.btn {
			margin: 150rpx auto 0;
			width: 90%;
			height: 88rpx;
			background: #58c866;
			border-radius: 44rpx;
			line-height: 88rpx;
			text-align: center;
			color: #ffffff;
		}
	}
</style>